.ag-checkbox-input-wrapper,
.ag-radio-button-input-wrapper {
    flex: none;
    position: relative;
    width: var(--ag-icon-size);
    height: var(--ag-icon-size);
    background-color: var(--ag-checkbox-unchecked-background-color);
    border: solid var(--ag-checkbox-border-width) var(--ag-checkbox-unchecked-border-color);

    :where(input) {
        cursor: pointer;
        appearance: none;
        opacity: 0;
        margin: 0;
        display: block;
        width: var(--ag-icon-size);
        height: var(--ag-icon-size);
    }

    &::after {
        content: '';
        position: absolute;
        display: block;
        inset: 0;
        mask-position: center;
        mask-repeat: no-repeat;
        pointer-events: none;
    }

    &:where(.ag-checked) {
        background-color: var(--ag-checkbox-checked-background-color);
        border-color: var(--ag-checkbox-checked-border-color);

        &::after {
            background-color: var(--ag-checkbox-checked-shape-color);
        }
    }

    &:where(:focus-within, :active) {
        box-shadow: var(--ag-focus-shadow);
    }

    &:where(.ag-disabled) {
        opacity: 0.5;
        filter: grayscale();
    }
}

.ag-checkbox-input-wrapper {
    border-radius: var(--ag-checkbox-border-radius);

    &:where(.ag-checked)::after {
        mask-image: var(--ag-checkbox-checked-shape-image);
    }

    &:where(.ag-indeterminate) {
        background-color: var(--ag-checkbox-indeterminate-background-color);
        border-color: var(--ag-checkbox-indeterminate-border-color);

        &::after {
            background-color: var(--ag-checkbox-indeterminate-shape-color);
            mask-image: var(--ag-checkbox-indeterminate-shape-image);
        }
    }
}

/* stylelint-disable-next-line */
.ag-cell-editing-error .ag-checkbox-input-wrapper:focus-within {
    box-shadow: var(--ag-focus-error-shadow);
}

.ag-radio-button-input-wrapper {
    border-radius: 100%;

    &:where(.ag-checked)::after {
        mask-image: var(--ag-radio-checked-shape-image);
    }
}
